layui.use(['element',"laytpl"],function () {
    var $ = layui.jquery ,
        element = layui.element,
        laytpl = layui.laytpl;
    //获取当前用户信息
    function getUser(value,ather){
        var $the = $(".j-user"),
            user_head = $the.attr("data-user-head"), //获取当前用户头像
            user_name = $the.attr("data-user-name"), //获取当前用户头像
            user_id = $the.attr("data-user-id");//获取当前用户唯一标识
        return{
            value:value, //用户回复
            user_head:user_head,
            user_name:user_name,
            user_id:user_id,
            ather:ather||{}//其它信息
        }
    }
    $(".say-talk-btn button").click(function (){
        var $the = $(this),
            html = $("#j-temp-replay").html(),
            val = $(".j-reply-textarea").val();//回复内容
        data=getUser(val);
        /* TODO "异步提交数据成功后更新页面数据"*/;
        var str = laytpl(html).render(data,function(str){
            $("#j-temp-replay").before(str);
        });
        $(".j-reply-on").removeClass("j-reply-on");
        $(".j-reply-textarea").val("");
    });
    var rep_id = 0;
    $(".l-talk-comment").on("click",".j-reply",function(){
        var self= this,jn = "j-reply-on",at = $(self).attr("data-at"),
            show = $(self).attr("show"),$p = $(self).parents(".comm-item"),
            pid = $p.attr("data-id");//作为下级的父级
        $(self).parents(".item").find("[show=true]").each(function () {
            $(self).parents(".comments-item").find("[show=true]").removeClass("hide");
            $(this).addClass("hide");
        })
        $("."+jn).removeClass(jn)
        //提交按钮
        $(self).parents(".item").find(".item-reply").addClass(jn).find("button").each(function(){
            $comment =$(self).parents(".item").find(".j-comment");
            this.onclick=function(){
                var $item = $comment.find(".comm-item:last"),
                    $textarea = $(self).parents(".item").find(".item-reply").addClass(jn).find("textarea"),
                    val = $textarea.val();
                //替换@name[id]成 <a href="***/id">@name</a>
                var id = val.substring(val.indexOf("[")+1,val.indexOf("]")),name = val.substring(0,val.indexOf("[")),ather=val.substring(val.indexOf("]")+1,val.length);
                val = " <a href=\"***/"+id+"\">"+name+"</a>&nbsp;&nbsp;"+ather;
                /* TODO "异步提交数据成功后更新页面数据"*/;
                data =getUser(val,{rep_id:rep_id,"pid":pid})
                html = $("#j-temp-praise").html();

                laytpl(html).render(data,function(str){
                    rep_id++;
                    if(at){
                        //待优化 回复回复有问题
                        var $praise = $p.parent().find("[pid ="+pid+"]");
                        if($praise.length<1){
                            $p.after(str);
                        }else{
                            $p.parent().find("[pid ="+pid+"]:last").after(str);
                        }
                    }else {
                        if($item.length<1){
                            $comment.html(str)
                        }else{
                            $item.after(str);
                        }
                    }
                });
                //添加完成后置空textarea
                $textarea.val("");
                $(".j-reply-on").removeClass("j-reply-on");
            }
        })
        //textarea 相关操作
        $(self).parents(".item").find(".item-reply").addClass(jn).find("textarea").each(function(){
            $(this).val(at||"");
            this.atlength = (at||"").length;
            this.onfocus = function () {
                var the = this,i=this.i|0,$the=$(the);
                this.onkeyup=function(e){
                    if(the.selectionStart<=the.atlength){
                        e.returnValue = false;
                        the.selectionStart = the.atlength;
                    }
                }
                this.onkeydown = function (e) {
                    if(the.selectionStart<=the.atlength){
                        if(e.key==="Backspace"){
                            e.returnValue = false;
                        }
                    }
                    if("Enter"===e.key){
                        the.i=++i
                        var h = 17+20*i;
                        if(h>180){
                            $the.css("overflow","auto")
                        }else{
                            $the.css("overflow","hidden")
                        }
                        $the.height(h+"px");
                    }
                }
            }
        }).focus();
    })
})